<template>
	<view>
		<!-- pages/user/profit/index.wxml -->
		<!-- 头部 -->
		<navber id="head-navber" :navbarData="navbarData"></navber>

		<!-- 收益 -->
		<view class="integral">
			<view class="integral-info">
				<image :src="imgUrl + '/imgs/user/profit/bac.png'" class="integral-info-img"></image>
				<div class="integral-info-item">
					<view class="integral-info-title">- 总收益 -</view>
					<view class="integral-info-number">{{ userEarnings }}</view>
				</div>
				<div class="integral-info-item">
					<view class="integral-info-title">- 冻结 -</view>
					<view class="integral-info-number">{{ userFreeze }}</view>
				</div>
				<div class="integral-info-item">
					<view class="integral-info-title">- 当天收益 -</view>
					<view class="integral-info-number">{{ dayEarnings }}</view>
				</div>
				<div class="integral-info-item">
					<view class="integral-info-title">- 未结算 -</view>
					<view class="integral-info-number">{{ settleEarnings }}</view>
				</div>
			</view>
			<view class="integral-but">
				<view class="integral-but-item">
					<view class="integral-but-item-text" @tap="switch_check($event, { value: '1' })" data-value="1">
						返现收益
						<view class="integral-but-item-text-bottom" v-if="butCheck == 1"></view>
					</view>
				</view>
				<view class="integral-but-item">
					<view class="integral-but-item-text" @tap="switch_check($event, { value: '2' })" data-value="2">
						佣金收益
						<view class="integral-but-item-text-bottom" v-if="butCheck == 2"></view>
					</view>
				</view>
				<!-- <view class="integral-but-item">
                    <view class="integral-but-item-text" @tap="switch_check($event, { value: '3' })" data-value="3">
                        任务收益
                        <view class="integral-but-item-text-bottom" v-if="butCheck == 3"></view>
                    </view>
                </view> -->
				<view class="integral-but-item">
					<view class="integral-but-item-text" @tap="switch_check($event, { value: '4' })" data-value="4">
						提现记录
						<view class="integral-but-item-text-bottom" v-if="butCheck == 4"></view>
					</view>
				</view>
			</view>
		</view>
		<view class="time-s">
			<u-datetime-picker :show="show" v-model="timeDay" mode="date" @c @confirm="onConfirm" @cancel="onCancel">
			</u-datetime-picker>
			<view class="time_day_str" @click="show = true">{{timeDayStr}}</view>
		</view>
		<!-- 列表 -->
		<view class="integral-list">
			<view class="integral-list-item" v-for="(item, index) in dataList" :key="index">
				<view class="integral-list-item-text1">{{ item.create_date }}</view>

				<view class="integral-list-item-text2">{{ item.detail }}</view>

				<view class="integral-list-item-line"></view>

				<view class="integral-list-item-text3">
					<view v-if="item.type == 4" :class="'tip ' + (item.check == 1 ? 'check' : '')">{{ item.check_str }}
					</view>
					<view v-if="item.type == 4">{{ item.symbol }}{{ item.deposit }}</view>
					<view v-else>{{ item.symbol }}{{ item.price }}</view>
				</view>
			</view>
			<view class="end"></view>
		</view>

		<!-- 提现到微信 -->
		<view class="withdrawal" @tap="wx_withdrawal">提现到微信</view>

		<!-- 提现弹框 -->

		<view class="withdrawal-frame" v-if="frameShow">
			<view class="withdrawal-frame-bac">
				<view class="withdrawal-frame-bac-title">收益提现</view>
				<view class="withdrawal-frame-tag">
					<view class="frame-tag-title">手续费用提示</view>
					<view class="">大于50小于300手续费8%，大于300小于600手续费7%，大于600小于1000手续费6%，大于1000手续费5%</view>
					<view class="deposit-tag">微信提现限制每天200元</view>
				</view>
				<view class="withdrawal-frame-bac-info">
					<view class="withdrawal-frame-bac-info-text">当前收益</view>
					<view class="withdrawal-frame-bac-info-price">¥{{ userDeposit }}</view>
				</view>
				<view class="withdrawal-frame-bac-input">
					<input placeholder="请输入提现金额" type="number" @input="priceInput" />
				</view>
				<view class="withdrawal-frame-bac-but">
					<view class="withdrawal-frame-bac-but-cancel" @tap="wx_withdrawal_cancel">取消</view>
					<view class="withdrawal-frame-bac-but-confirm" @tap="wx_withdrawal_confirm">提现</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import navber from '@/components/navber/index';
	// pages/user/profit/index.js
	const Config = require('../../../config/index.js');
	const app = getApp();
	const Api = require('../../../api/index.js');

	export default {
		components: {
			navber
		},
		data() {
			return {
				navbarData: {
					title: '我的收益' //顶部标题
				},
				//导航栏
				imgUrl: Config.imgUrl,
				//图片url
				butCheck: 1,
				frameShow: false,
				userEarnings: 0,
				userFreeze: 0,
				dayEarnings: 0,
				settleEarnings:0,
				userDeposit: 0,
				//用户收益
				dataList: [],
				//数据
				pagenow: 1,
				openid: "",
				price: 0, //体现金额

				timeDayStr: this.FormatTime(new Date()), //
				timeDay: Number(new Date()), //截止时间（倒退十天记录)
				show: false
			};
		},
		onReachBottom: function(e) {
			//滚动底部
			this.getData();
		},
		onShow() {
			this.setData({
				dataList: [],
				pagenow: 1
			});
			this.getData();
		},
		onPullDownRefresh(e) {
			this.setData({
				dataList: [],
				pagenow: 1
			});
			this.getData();
			uni.stopPullDownRefresh();
		},
		methods: {
			onConfirm(e) {
				// console.log(e);
				this.timeDay = e.value;
				// console.log(this.timeDay);
				this.timeDayStr = this.FormatTime(new Date(this.timeDay));
				// console.log(this.timeDayStr);
				this.show = false;
				this.getData(true);
			},
			onCancel() {
				this.show = false;
			},
			switch_check(e, _dataset) {

				if (!e.currentTarget) {
					if (_dataSet.tagId) {
						e.currentTarget = {
							id: _dataSet.tagId
						};
					} else {
						e.currentTarget = {
							dataset: _dataSet
						};
					}
				}

				//标签
				this.setData({
					butCheck: e.currentTarget.dataset.value,
					pagenow: 1,
					dataList: []
				});
				this.getData();
			},

			wx_withdrawal(e, _dataset) {

				if (!e.currentTarget) {
					if (_dataSet.tagId) {
						e.currentTarget = {
							id: _dataSet.tagId
						};
					} else {
						e.currentTarget = {
							dataset: _dataSet
						};
					}
				}
				var that = this;
				uni.getUserProfile({
					desc: '用于提现账号绑定',
					// 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						// console.log(res);
						that.getSessionKey();
						//微信提现
						that.setData({
							frameShow: true
						});
					}
				});
			},
			getSessionKey() {
				var _this = this;
				uni.login({
					success(res) {
						var data = {
							code: res.code,
							appid: app.globalData.appid,
							type: 'every' //one一次 every每次
						};
						Api.getSessionKey(data).then((res) => {
							if (res.code == 1) {
								var data = res.data;
								if (data.openid != '') {
									_this.setData({
										openid: data.openid
									});
								}
							}
						});
					}
				});
			},
			priceInput(e, _dataset) {

				if (!e.currentTarget) {
					if (_dataSet.tagId) {
						e.currentTarget = {
							id: _dataSet.tagId
						};
					} else {
						e.currentTarget = {
							dataset: _dataSet
						};
					}
				}

				this.setData({
					price: e.detail.value
				});
			},

			wx_withdrawal_cancel(e, _dataset) {

				if (!e.currentTarget) {
					if (_dataSet.tagId) {
						e.currentTarget = {
							id: _dataSet.tagId
						};
					} else {
						e.currentTarget = {
							dataset: _dataSet
						};
					}
				}

				//提现取消
				this.setData({
					frameShow: false
				});
			},

			wx_withdrawal_confirm(e, _dataset) {
				if (!e.currentTarget) {
					if (_dataSet.tagId) {
						e.currentTarget = {
							id: _dataSet.tagId
						};
					} else {
						e.currentTarget = {
							dataset: _dataSet
						};
					}
				}

				var json = {
					price: this.price,
					openid: this.openid
				}; //提现确认

				Api.userEarningExtract(json).then((res) => {
					if (res.code == 1) {
						uni.showToast({
							title: '提现申请成功',
							icon: 'none',
							duration: 2000
						});
					} else {
						uni.showToast({
							title: '提现申请失败',
							icon: 'none',
							duration: 2000
						});
					}

				});

				this.setData({
					frameShow: false
				});
			},

			getData() {
				//获取数据
				var json = {
					type: this.butCheck,
					day: this.timeDayStr,
					pagenow: this.pagenow
				};

				Api.userEarnings(json).then((res) => {
					
					if (res.code == 1) {
						this.setData({
							userEarnings: res.data.earnings_price,
							userFreeze: res.data.freeze_price,
							userDeposit: res.data.deposit_price,
							dayEarnings: res.data.day_price,
							settleEarnings:res.data.settle_price
						});

						if (res.data.list.length > 0) {
							var data = this.dataList;
							data = data.concat(res.data.list);
							var page = this.pagenow + 1;
							this.setData({
								dataList: data,
								pagenow: page
							});
						} else {
							// wx.showToast({
							//   title: '暂无数据',
							//   icon: 'none',
							//   duration: 2000
							// })
						}
					}
				});
			},
			FormatTime(dat) {
				//获取年月日，时间
				var year = dat.getFullYear();
				var mon = (dat.getMonth() + 1) < 10 ? "0" + (dat.getMonth() + 1) : dat.getMonth() + 1;
				var data = dat.getDate() < 10 ? "0" + (dat.getDate()) : dat.getDate();
				var newDate = year + "-" + mon + "-" + data
				return newDate;
			}
		}
	};
</script>
<style>
	@import './index.css';
</style>
